<script setup lang="ts">
import { defineProps } from 'vue'
/**
 * 获取计划详情
 * standard_price_template:标准模板(含价格)
 * standard_noprice_template:标准模板(不含价格)
 * front_bg_template:前置背景图模板
 * countdown_template:倒计时模板
 * postposition_questionnaire_template:后置问卷模板
 * group_template:团购模板
 */
// 接收父组件传递的templateInfo参数
const props = defineProps<{
  templateInfo?: any
}>()
const emit = defineEmits(['submit'])
const submit = async () => {
  emit('submit')
}
</script>

<template>
  <div class="groupBtn">
    <div class="singleBuy" @click="submit">
        <div>￥{{props.templateInfo?.originalPrice||0}}</div>
        <div style="margin-top: 2px;">单独购买</div>
    </div>
    <div class="groupBuy" @click="submit">
        <span>￥ {{props.templateInfo?.price||0}}</span>
        <span> 一键购买</span>
    </div>
  </div>
</template>

<style scoped lang="scss">
.groupBtn {
    position: fixed;
    bottom: 0;
    z-index: 10;
    width: 10rem;
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
    padding: 10px 15px;
    background: #fff;
    box-shadow: 0px 0px 1px#333333 ;
    -webkit-box-shadow: 0px 0px 1px #333333 ;
    .singleBuy{
        border: 1px solid #d32602;
        font-size: 14px;
        color: #d32602;
        line-height: 16px;
        border-radius: 5px;
        margin-right: 10px;
        text-align: center;
        padding: 4px 30px;
    }
    .groupBuy{
        border-radius: 5px;
        background: #d32602;
        color: #fff;
        font-size: 16px;
        text-align: center;
        flex: 1;
        line-height: 44px;
    }
}

</style>